<template>
  <a-card :bordered="false">
    <a-spin :spinning="confirmLoading">
      <h2 style="text-align: center;">省外异地管控-外省转入申请表</h2>
      <a-radio-group v-model="controlPersonType" style="margin-bottom: 40px;">
        <a-radio :value="1"> 社戒社康人员 </a-radio>
        <a-radio :value="2"> 社会面人员 </a-radio>
      </a-radio-group>
      <step-components :steps="components.map(v => v.title)" :current="current" />
      <component class="component-action" ref="refComponent" :controlPersonType="controlPersonType" :current="current"
        :value="setValue()" :is="allComps[getComponents('componentsName')]" @change="onChange" />
      <div class="submit-action">
        <a-space class="btn-div" :size="14">
          <a-button type="primary" v-if="current < components.length" @click="next"> 下一步 </a-button>
          <a-button v-if="current > 1" @click="prev"> 上一步 </a-button>
          <template v-if="current === components.length">
            <a-button type="primary" @click="onSubmit"> 提交 </a-button>
          </template>
        </a-space>
      </div>
    </a-spin>
  </a-card>
</template>

<script>
import { otherProvinceIntoApply } from '@/api/sjsk/personService'
import allComps, { componentsOne, componentsTwo } from './modules/index';
import stepComponents from "./modules/step.vue";
export default {
  inject: ['closeCurrent'],
  components: { stepComponents },
  data() {
    return {
      current: 1,
      confirmLoading: false,
      doStatue: 'add',
      controlPersonType: 1, // 管控人员类型 1：社戒社康 2：社会面人员
      allComps: allComps,
      componentsOne: componentsOne,
      componentsTwo: componentsTwo,
      otherProvinceIntoApplyVO: {}
    }
  },
  computed: {
    components() {
      let component = this.controlPersonType === 1 ? this.componentsOne : this.componentsTwo
      return component
    }
  },
  methods: {
    getComponents(key) {
      let item = this.components.find(obj => { return obj.type == this.current })
      return item[key]
    },
    async prev() {
      this.getValue();
      this.current--;
      this.setValue();
    },
    next() {
      this.getValue();
      if (this.current == 1 || this.current == 4 || this.current == 5) {
        this.onValidate();
      } else {
        if (this.current === 2 && Object.keys(this.otherProvinceIntoApplyVO).length > 0 && this.otherProvinceIntoApplyVO['baseFamilyVO'] && this.otherProvinceIntoApplyVO['baseFamilyVO'].length === 0) {
          this.$message.warn('请至少新增一条数据！')
          return;
        } else {
          this.current++;
          this.setValue();
        }
      }
    },
    onValidate() {
      const { refComponent } = this.$refs
      refComponent.$refs.ruleForm.validate((valid) => {
        if (valid) {
          this.current++;
          this.setValue();
        } else {
          return false
        }
      })
    },
    onSubmit() {
      this.getValue()
      const { refComponent } = this.$refs
      refComponent.$refs.ruleForm.validate((valid) => {
        if (valid) {
          this.confirmLoading = true
          this.$set(this.otherProvinceIntoApplyVO, 'controlPersonType', this.controlPersonType)
          this.$set(this.otherProvinceIntoApplyVO.personInfoVO, 'controlPersonType', this.controlPersonType)
          otherProvinceIntoApply(this.otherProvinceIntoApplyVO)
            .then(res => {
              this.confirmLoading = false
              if (res.success) {
                this.$message.success(res.message)
                // this.$emit('ok');
              } else {
                this.$message.warn(res.message)
              }
            })
            .catch(e => {
              this.$message.warn('请求失败！')
              this.confirmLoading = false
            })
        } else {
          return false
        }
      })
    },
    getValue() {
      const { refComponent } = this.$refs
      let ObjectValue = {}, ArrayValue = []
      // console.log("this.current")
      // console.log(this.current)
      if (this.current === 1) {
        ObjectValue = refComponent.model
        console.log(ObjectValue)
        this.$set(this.otherProvinceIntoApplyVO, 'personInfoVO', ObjectValue)
      }
      if (this.current === 2) {
        ArrayValue = refComponent.pageData
        this.$set(this.otherProvinceIntoApplyVO, 'baseFamilyVO', ArrayValue)
      }
      if (this.current === 3) {
        ArrayValue = refComponent.pageData
        this.$set(this.otherProvinceIntoApplyVO, 'otherCriminalRecordVO', ArrayValue)
      }
      if (this.current === 4) {
        ObjectValue = refComponent.model
        this.$set(this.otherProvinceIntoApplyVO, 'locationInfoVO', ObjectValue)
      }
      if (this.current === 5) {
        ObjectValue = refComponent.model
        this.$set(this.otherProvinceIntoApplyVO, 'outsideControlApplyInfoVO', ObjectValue)
      }
    },
    setValue() {
      let ObjectValue = {}, ArrayValue = []
      if (this.current === 1 && Object.keys(this.otherProvinceIntoApplyVO).length > 0 && this.otherProvinceIntoApplyVO['personInfoVO']) {
        ObjectValue = this.otherProvinceIntoApplyVO['personInfoVO']
      }
      if (this.current === 2 && Object.keys(this.otherProvinceIntoApplyVO).length > 0 && this.otherProvinceIntoApplyVO['baseFamilyVO']) {
        ArrayValue = this.otherProvinceIntoApplyVO['baseFamilyVO']
      }
      if (this.current === 3 && Object.keys(this.otherProvinceIntoApplyVO).length > 0 && this.otherProvinceIntoApplyVO['otherCriminalRecordVO']) {
        ArrayValue = this.otherProvinceIntoApplyVO['otherCriminalRecordVO']
      }
      if (this.current === 4 && Object.keys(this.otherProvinceIntoApplyVO).length > 0) {
        const { personInfoVO } = this.otherProvinceIntoApplyVO
        let InfoVO = { liveAddress: personInfoVO.currentAddress }
        if (this.otherProvinceIntoApplyVO['locationInfoVO']) {
          ObjectValue = Object.assign({}, this.otherProvinceIntoApplyVO['locationInfoVO'], InfoVO)
        } else {
          ObjectValue = Object.assign({}, InfoVO)
        }
      }
      if (this.current === 5 && Object.keys(this.otherProvinceIntoApplyVO).length > 0) {
        const { personInfoVO } = this.otherProvinceIntoApplyVO
        let InfoVO = {
          realName: personInfoVO.realName,
          houseLevels: personInfoVO.houseLevels,
          householdAddress: personInfoVO.householdAddress,
          householdPoliceStation: personInfoVO.householdPoliceStation,
          registerManagerName: personInfoVO.registerManagerName,
          registerManagerPhone: personInfoVO.registerManagerPhone,
          policeName: personInfoVO.policeName,
          policePhone: personInfoVO.policePhone,
          currentAddress: personInfoVO.currentAddress,
          currentLevel: personInfoVO.currentLevel,
          currentLevels: personInfoVO.currentLevels,
          currentTown: personInfoVO.currentTown,
          currentPoliceStation: personInfoVO.currentPoliceStation,
          country: personInfoVO.country
        }
        if (this.otherProvinceIntoApplyVO['outsideControlApplyInfoVO']) {
          ObjectValue = Object.assign({}, this.otherProvinceIntoApplyVO['outsideControlApplyInfoVO'], InfoVO)
        } else {
          ObjectValue = Object.assign({}, InfoVO)
        }
      }
      let value = this.current === 1 || this.current === 4 || this.current === 5 ? ObjectValue : ArrayValue
      console.log(this.current, value)
      return value
    },
    onChange(type, value) {
      if (type === 1) this.$set(this.otherProvinceIntoApplyVO, 'personInfoVO', value)
      if (type === 2) this.$set(this.otherProvinceIntoApplyVO, 'baseFamilyVO', value)
      if (type === 3) this.$set(this.otherProvinceIntoApplyVO, 'otherCriminalRecordVO', value)
      if (type === 4) this.$set(this.otherProvinceIntoApplyVO, 'locationInfoVO', value)
      if (type === 5) this.$set(this.otherProvinceIntoApplyVO, 'outsideControlApplyInfoVO', value)
      console.log('otherProvinceIntoApplyVO', this.otherProvinceIntoApplyVO)
    }
  }
}
</script>
<style lang="less" scoped>
.component-action {
  margin: 35px 32px;
}

.submit-action {
  margin-left: 32px;
  margin-right: 32px;
}
</style>